@use '@/styles/var/index.scss' as *;

#app {
  // 顶层元素
  .app-wrapper {
    display: flex;
    box-sizing: border-box;
    width: 100vw;
    height: 100vh;
  }

  // 侧边栏样式
  .sidebar-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: $side-bar-width;
    transition: all 0.3s;
    border-right: 1px solid #E4E7EDFF;
    background-color: $menu-bg;
    box-shadow: 1px 0 2px rgb(28 29 30 / 8%);

    --el-menu-base-level-padding: 18px;
    --el-menu-level-padding: 18px;
    --el-menu-icon-width: 20px;


    .el-menu {
      width: calc($side-bar-width - 1px);
      height: 100%;
      border: none;
    }

    .scrollbar-wrapper {
      overflow-x: hidden !important;
    }

    .el-scrollbar {
      flex: 1;
      height: 100%;
    }

  }


}